<template>
    <div class="" style="color: white;background-color:rgba(3,3,3,0.5);width:22vw;height:100vh;">
        <div id="coding" style="width:100%;height:250px;padding-top:10vh;"></div>
        <div id="scanCode" style="width:100%;height:250px;"></div>
    </div>
</template>
<script>
import * as echarts from 'echarts';
import axios from 'axios'
import {datacenter_uniqueId,datacenter_nuniqueId} from '@/request/supervisionCenterApi.js'
export default {
    data() {
        return {
			monthData: [],
            codingData: [],
            scanCodeData: [],
            cityCode:[],
        };
    },
    computed: {

    },
    mounted() {
        this.init()
        this.init1()
    },
    methods: {
        //赋码量
        init() {
            var date = new Date();
            let month = date.getMonth()+1
            let i = month
            for(i; i>0 ; i--){
                this.monthData.push(i+'月')
            }

            let j = 12
            let k = month
            for(j; j>k;j--){
                this.monthData.push(j+'月')
            }
            this.monthData = this.monthData.reverse()

            //12个月的赋码数量
            // axios.post("http://192.168.0.148:8880/plant/box/uniqueId").then((res) =>{
            axios.post("https://bbgy.cpzsyun.com:82/api/plant/box/uniqueId").then((res) =>{
                let resData = res.data.data
                this.codingData = resData.reverse()

                let myEchart = echarts.init(document.getElementById("coding"));
                let option = {
                    title:{
                        text:"赋码量",
                    textStyle: {
                        color:['white'],
                        fontSize: 14,

                    },
                    top: 20
                },
                // tooltip:{},
                // legend:{},
                xAxis:{
                    data: this.monthData,
                    axisLabel: {
                        color: ['white'],
                        fontSize: 10,
                        interval: 0
                    }
                },
                yAxis:{
                    axisLabel: {
                            color: ['white'],
                        fontSize: 10,
                    }
                },
                series:[{
                    name:'赋码量',
                    type:"line",
                    data:this.codingData
                }]
                };
                myEchart.setOption(option);
            })
        },
        //扫码量
        init1() {
            // axios.post("http://192.168.0.148:8880/plant/traceinfo/uniqueId").then((res) =>{
            axios.post("https://bbgy.cpzsyun.com:82/api/plant/traceinfo/uniqueId").then((res) =>{
                // console.log(res.reverse());
                let resDatas = res.data.data
                this.scanCodeData = resDatas.reverse()

                let myEchart = echarts.init(document.getElementById("scanCode"));
                let option = {
                    title:{
                        text:"扫码量",
                    textStyle: {
                        color:['white'],
                        fontSize: 14,
                    },
                    top: 20
                },
                // tooltip:{},
                // legend:{},
                xAxis:{
                    data: this.monthData,
                    axisLabel: {
                        color: ['white'],
                        fontSize: 10,
                        interval: 0
                    }
                },
                yAxis:{
                    axisLabel: {
                        color: ['white'],
                        fontSize: 10,
                    }
                },
                series:[{
                    name:'扫码量',
                    type:"bar",
                    data:this.scanCodeData
                }]
                };
                myEchart.setOption(option);
                console.log(option,'市场洞察')
            })
        },

    },
	created(){

	}
};
</script>
<style scoped>

</style>
